<template>
  <div>
    <a href="https://github.com/FranckFreiburger/vue-pdf#readme">vuepdf参考文档</a>
    <h1>当前页数：{{currentPage}} / {{pageCount}}</h1>
    <div class="pdf-box">
      <pdf
        src="http://qinniu.douziqianduan.icu/oa_work01.pdf"
        @num-pages="pageCount = $event"
        @page-loaded="currentPage = $event"
      ></pdf>
    </div>
  </div>
</template>


<script>
import pdf from "vue-pdf";
export default {
  name: "Pdf01",
  components: {
    pdf,
  },
  data() {
    return {
      currentPage: 0,
      pageCount: 0,
    };
  },
};
</script>


<style scoped>
.pdf-box {
  margin: 20px auto;
  min-height: 200px;
  width: 50%;
  border: 2px solid black;
}
</style>
